Тестване в TypeScript: Стратегии за тип-безопасно внедряване на тестове за надежден код

В сферата на разработката на софтуер осигуряването на качеството на кода е от първостепенно значение. TypeScript, със своята строга система за типизиране, предлага уникална възможност за създаване на по-надеждни и поддържаеми приложения. Тази статия разглежда различни стратегии за тестване в TypeScript, като подчертава как да се използва типовата безопасност за създаване на надеждни и ефективни тестове. Ще разгледаме различни подходи за тестване, рамки и добри практики, предоставяйки ви изчерпателно ръководство за тестване в TypeScript.

Защо типовата безопасност е важна при тестването

Системата за статично типизиране на TypeScript предоставя няколко предимства при тестването:

• Ранно откриване на грешки: TypeScript може да открие грешки, свързани с типовете, по време на разработката, намалявайки вероятността от грешки по време на изпълнение.
• Подобрена поддръжка на кода: Типовете улесняват разбирането и рефакторирането на кода, което води до по-лесни за поддръжка тестове.
• Подобрено покритие на тестовете: Типовата информация може да насочва създаването на по-обхватни и целенасочени тестове.
• Намалено време за отстраняване на грешки: Грешките в типовете са по-лесни за диагностициране и отстраняване в сравнение с грешките по време на изпълнение.

Нива на тестване: Изчерпателен преглед

Надеждната стратегия за тестване включва множество нива на тестване за осигуряване на цялостно покритие. Тези нива включват:

• Модулно тестване: Тестване на отделни компоненти или функции изолирано.
• Интеграционно тестване: Тестване на взаимодействието между различни единици или модули.
• Край до край (E2E) тестване: Тестване на целия работен процес на приложението от гледна точка на потребителя.

Модулно тестване в TypeScript: Осигуряване на надеждност на ниво компонент

Избор на рамка за модулно тестване

Предлагат се няколко популярни рамки за модулно тестване за TypeScript, включително:

• Jest: Цялостна рамка за тестване с вградени функции като мокиране, покритие на кода и тестване със снимки. Тя е известна със своята лекота на използване и отлична производителност.
• Mocha: Гъвкава и разширяема рамка за тестване, която изисква допълнителни библиотеки за функции като утвърждаване и мокиране.
• Jasmine: Друга популярна рамка за тестване с чист и четим синтаксис.

За тази статия ще използваме предимно Jest поради неговата простота и изчерпателни функции. Принципите, които ще бъдат обсъдени, обаче важат и за други рамки.

Пример: Модулно тестване на функция в TypeScript

Разгледайте следната функция в TypeScript, която изчислява сумата на отстъпката:

            // src/discountCalculator.ts
export function calculateDiscount(price: number, discountPercentage: number): number {
  if (price < 0 || discountPercentage < 0 || discountPercentage > 100) {
    throw new Error("Invalid input: Price and discount percentage must be non-negative, and discount percentage must be between 0 and 100.");
  }
  return price * (discountPercentage / 100);
}

            

              
                Copy
              
            
          

Ето как можете да напишете модулен тест за тази функция, използвайки Jest:

            // test/discountCalculator.test.ts
import { calculateDiscount } from '../src/discountCalculator';

describe('calculateDiscount', () => {
  it('should calculate the discount amount correctly', () => {
    expect(calculateDiscount(100, 10)).toBe(10);
    expect(calculateDiscount(50, 20)).toBe(10);
    expect(calculateDiscount(200, 5)).toBe(10);
  });

  it('should handle zero discount percentage correctly', () => {
    expect(calculateDiscount(100, 0)).toBe(0);
  });

  it('should handle 100% discount correctly', () => {
    expect(calculateDiscount(100, 100)).toBe(100);
  });

  it('should throw an error for invalid input (negative price)', () => {
    expect(() => calculateDiscount(-100, 10)).toThrowError("Invalid input: Price and discount percentage must be non-negative, and discount percentage must be between 0 and 100.");
  });

  it('should throw an error for invalid input (negative discount percentage)', () => {
    expect(() => calculateDiscount(100, -10)).toThrowError("Invalid input: Price and discount percentage must be non-negative, and discount percentage must be between 0 and 100.");
  });

  it('should throw an error for invalid input (discount percentage > 100)', () => {
    expect(() => calculateDiscount(100, 110)).toThrowError("Invalid input: Price and discount percentage must be non-negative, and discount percentage must be between 0 and 100.");
  });
});

            

              
                Copy
              
            
          

Този пример демонстрира как системата за типове на TypeScript помага да се гарантира, че правилните типове данни се предават на функцията и че тестовете обхващат различни сценарии, включително крайни случаи и условия за грешки.

Използване на типове TypeScript в модулни тестове

Системата за типове на TypeScript може да се използва за подобряване на яснотата и поддръжката на модулните тестове. Например, можете да използвате интерфейси, за да дефинирате очакваната структура на обекти, върнати от функции:

            interface User {
  id: number;
  name: string;
  email: string;
}

function getUser(id: number): User {
  // ... implementation ...
  return { id: id, name: "John Doe", email: "john.doe@example.com" };
}

it('should return a user object with the correct properties', () => {
  const user = getUser(123);
  expect(user.id).toBe(123);
  expect(user.name).toBe('John Doe');
  expect(user.email).toBe('john.doe@example.com');
});

            

              
                Copy
              
            
          

Като използвате интерфейса `User`, гарантирате, че тестът проверява правилните свойства и типове, което го прави по-надежден и по-малко податлив на грешки.

Мокиране и заглушаване с TypeScript

При модулното тестване често е необходимо да се изолира тестваната единица чрез мокиране или заглушаване на нейните зависимости. Системата за типове на TypeScript може да помогне да се гарантира, че моковете и заглушаванията са правилно внедрени и че те отговарят на очакваните интерфейси.

Разгледайте функция, която разчита на външна услуга за извличане на данни:

            interface DataService {
  getData(id: number): Promise;
}

class MyComponent {
  constructor(private dataService: DataService) {}

  async fetchData(id: number): Promise {
    return this.dataService.getData(id);
  }
}

            

              
                Copy
              
            
          

За да тествате `MyComponent`, можете да създадете мок внедряване на `DataService`:

            class MockDataService implements DataService {
  getData(id: number): Promise {
    return Promise.resolve(`Data for id ${id}`);
  }
}

it('should fetch data from the data service', async () => {
  const mockDataService = new MockDataService();
  const component = new MyComponent(mockDataService);
  const data = await component.fetchData(123);
  expect(data).toBe('Data for id 123');
});

            

              
                Copy
              
            
          

Като внедрява интерфейса `DataService`, `MockDataService` гарантира, че предоставя необходимите методи с правилните типове, предотвратявайки грешки, свързани с типове, по време на тестване.

Интеграционно тестване в TypeScript: Проверка на взаимодействията между модули

Интеграционното тестване се фокусира върху проверката на взаимодействията между различни единици или модули в рамките на приложението. Това ниво на тестване е от решаващо значение за гарантиране, че различните части на системата работят правилно заедно.

Пример: Интеграционно тестване с база данни

Разгледайте приложение, което взаимодейства с база данни за съхранение и извличане на данни. Интеграционен тест за това приложение може да включва:

• Настройка на тестова база данни.
• Запълване на базата данни с тестови данни.
• Изпълнение на код на приложението, който взаимодейства с базата данни.
• Проверка, че данните са правилно съхранени и извлечени.
• Почистване на тестовата база данни след приключване на теста.

            // integration/userRepository.test.ts
import { UserRepository } from '../src/userRepository';
import { DatabaseConnection } from '../src/databaseConnection';

describe('UserRepository', () => {
  let userRepository: UserRepository;
  let databaseConnection: DatabaseConnection;

  beforeAll(async () => {
    databaseConnection = new DatabaseConnection('test_database'); // Use a separate test database
    await databaseConnection.connect();
    userRepository = new UserRepository(databaseConnection);
  });

  afterAll(async () => {
    await databaseConnection.disconnect();
  });

  beforeEach(async () => {
    // Clear the database before each test
    await databaseConnection.clearDatabase();
  });

  it('should create a new user in the database', async () => {
    const newUser = { id: 1, name: 'Alice', email: 'alice@example.com' };
    await userRepository.createUser(newUser);

    const retrievedUser = await userRepository.getUserById(1);
    expect(retrievedUser).toEqual(newUser);
  });

  it('should retrieve a user from the database by ID', async () => {
    const existingUser = { id: 2, name: 'Bob', email: 'bob@example.com' };
    await userRepository.createUser(existingUser);

    const retrievedUser = await userRepository.getUserById(2);
    expect(retrievedUser).toEqual(existingUser);
  });
});

            

              
                Copy
              
            
          

Този пример демонстрира как да се настрои тестова среда, да се взаимодейства с база данни и да се провери дали кодът на приложението правилно съхранява и извлича данни. Използването на TypeScript интерфейси за бази данни (напр. `User`) осигурява типова безопасност през целия процес на интеграционно тестване.

Мокиране на външни услуги в интеграционни тестове

При интеграционни тестове често е необходимо да се мокират външни услуги, от които приложението зависи. Това позволява да се тества интеграцията между вашето приложение и услугата, без действително да се разчита на самата услуга.

Например, ако вашето приложение се интегрира с платежен портал, можете да създадете мок внедряване на портала, за да симулирате различни сценарии за плащане.

Край до край (E2E) тестване в TypeScript: Симулиране на потребителски работни потоци

Край до край (E2E) тестването включва тестване на целия работен поток на приложението от гледна точка на потребителя. Този тип тестване е от решаващо значение за гарантиране, че приложението работи правилно в реална среда.

Избор на рамка за E2E тестване

Предлагат се няколко популярни рамки за E2E тестване за TypeScript, включително:

• Cypress: Мощна и лесна за използване рамка за E2E тестване, която ви позволява да пишете тестове, които симулират потребителски взаимодействия с приложението.
• Playwright: Рамка за тестване на браузъри, която поддържа множество програмни езици, включително TypeScript.
• Puppeteer: Node библиотека, която предоставя API от високо ниво за контрол на headless Chrome или Chromium.

Cypress е особено подходящ за E2E тестване на уеб приложения поради своята лекота на използване и изчерпателни функции. Playwright е отличен за съвместимост с браузъри и разширени функции. Ще демонстрираме концепции за E2E тестване, използвайки Cypress.

Пример: E2E тестване с Cypress

Разгледайте просто уеб приложение с форма за вход. E2E тест за това приложение може да включва:

• Посещение на страницата за вход.
• Въвеждане на валидни идентификационни данни.
• Изпращане на формата.
• Проверка, че потребителят е пренасочен към началната страница.

            // cypress/integration/login.spec.ts
describe('Login', () => {
  it('should log in successfully with valid credentials', () => {
    cy.visit('/login');
    cy.get('#username').type('valid_user');
    cy.get('#password').type('valid_password');
    cy.get('button[type="submit"]').click();
    cy.url().should('include', '/home');
    cy.contains('Welcome, valid_user').should('be.visible');
  });

  it('should display an error message with invalid credentials', () => {
    cy.visit('/login');
    cy.get('#username').type('invalid_user');
    cy.get('#password').type('invalid_password');
    cy.get('button[type="submit"]').click();
    cy.contains('Invalid username or password').should('be.visible');
  });
});

            

              
                Copy
              
            
          

Този пример демонстрира как да се използва Cypress за симулиране на потребителски взаимодействия с уеб приложение и да се провери дали приложението се държи както се очаква. Cypress предоставя мощен API за взаимодействие с DOM, извършване на утвърждавания и симулиране на потребителски събития.

Типова безопасност в Cypress тестовете

Въпреки че Cypress е предимно базирана на JavaScript рамка, все още можете да използвате TypeScript, за да подобрите типовата безопасност на вашите E2E тестове. Например, можете да използвате TypeScript, за да дефинирате персонализирани команди и да типизирате данните, върнати от API извиквания.

Най-добри практики за тестване в TypeScript

За да гарантирате, че вашите TypeScript тестове са ефективни и лесни за поддръжка, имайте предвид следните най-добри практики:

• Пишете тестове рано и често: Интегрирайте тестването във вашия работен процес на разработка от самото начало. Разработката, водена от тестове (TDD), е отличeн подход.
• Фокусирайте се върху тестваемостта: Проектирайте кода си така, че да бъде лесно тестваем. Използвайте инжектиране на зависимости, за да разграничите компонентите и да ги направите по-лесни за мокиране.
• Поддържайте тестовете кратки и фокусирани: Всеки тест трябва да се фокусира върху един аспект на кода. Това улеснява разбирането и поддръжката на тестовете.
• Използвайте описателни имена на тестове: Избирайте имена на тестове, които ясно описват какво проверява тестът.
• Поддържайте високо ниво на покритие на тестовете: Стремете се към високо покритие на тестовете, за да гарантирате, че всички части на кода са адекватно тествани.
• Автоматизирайте вашите тестове: Интегрирайте вашите тестове в конвейер за непрекъсната интеграция (CI), за да стартирате автоматично тестове при всяка промяна на кода.
• Използвайте инструменти за покритие на кода: Използвайте инструменти за измерване на покритието на тестовете и идентифициране на области от кода, които не са адекватно тествани.
• Редовно рефакторирайте тестовете: С промяната на вашия код, рефакторирайте тестовете, за да ги поддържате актуални и лесни за поддръжка.
• Документирайте вашите тестове: Добавете коментари към вашите тестове, за да обясните целта на теста и всички предположения, които той прави.
• Следвайте AAA модела: Подредете, Изпълнете, Утвърдете. Това помага за структурирането на вашите тестове за четимост.

Заключение: Създаване на надеждни приложения с тип-безопасно тестване в TypeScript

Силната система за типизиране на TypeScript предоставя мощна основа за създаване на надеждни и поддържаеми приложения. Като използвате типовата безопасност във вашите стратегии за тестване, можете да създавате по-надеждни и ефективни тестове, които откриват грешки рано и подобряват общото качество на вашия код. Тази статия разглежда различни стратегии за тестване в TypeScript, от модулно тестване до интеграционно тестване и край до край тестване, предоставяйки ви изчерпателно ръководство за тестване в TypeScript. Като следвате най-добрите практики, очертани в тази статия, можете да гарантирате, че вашите TypeScript приложения са щателно тествани и готови за производство. Възприемането на цялостен подход за тестване от самото начало позволява на разработчиците по целия свят да създават по-надежден и лесен за поддръжка софтуер, което води до подобрено потребителско изживяване и намалени разходи за разработка. Тъй като приемането на TypeScript продължава да нараства, овладяването на тип-безопасно тестване става все по-ценно умение за софтуерните инженери по целия свят.